<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'index.jsp' starting page</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	css：层叠样式表。css3。装潢网页的。
	-->
  </head>
  
  <body>
    表格标签<br>
    <!-- tr是table row缩写，表示一行，
    td是 table data缩写，表示一行中的一格 
    th是table head缩写，表示每行的第一格-->
    <table 
    style="border: 3px solid #FF0000;"
     id="t1" name="" 
     class="tablestyle"
     align="center"
   
     >
    
    <!-- 网页元素有身份：
     1.身份证级别：id。(同一个页面必须不同)
     2.姓名级别：name。（可以重复，但最好不要重复）
     3.种族级别：class。（重复就对了）
     -->
     
    <!-- <a></a>超链接标签 href-->
    <!-- <form></form>表单 标签 ：随整个html行动的。
    和AJAX--只刷新ajax标签中的内容>
    <!-- 所有的html标签，都有一个属性叫style，表示使用css -->
    <tr>  <td id="">第一行</td>  <td>第一行</td>   </tr>
   <tr>  <td>第二行</td>   <td>第二行</td>  </tr>
    </table>
    <br>
    2.form
    <br>
    <a href=./result.jsp">ddd</a>
     <a href=./www.w3school.com.cn/tags/att_table_border.asp">ddd</a>
    <form id="form1" action="./result.jsp">
    <!-- form是一个虚拟的表单，专门用来提交页面数据。
    action属性。提供一个url，就是接受数据的地址 
    action的路径：
    1.如果action是非本项目的。请使用全程。http://xxxxx/xxx
    2.如果是本项目。从webroot开始算。每层用/。
    -->
    <input type="radio" value="1">单选框<br>
    <input type="checkbox"  value="yes">复选框<br>
    <input type="password" value="我是密码文本框"><br>
    <input type="text" value="我是文本框"><br>
   &nbsp; <input type="button" value="普通按钮"><br>
    <input type="submit" value="提交"><br><!-- input标签中的submit。
    提交整个表单的按钮 -->
    <!--  -->
    <input type="hidden" value="1111"><br>
    </form>
    3.登录表单<br>
    <form id="loginform" action="./result.jsp">
    账号：<input id="txt_name1" name="txt_name" type="text" value=""><br>
       密码：<input id="txt_pwd1"  name="txt_pwd" type="password" value=""><br>
         <input type="submit" value="登录"><br>
    </form>
    4.登录表单的验证<br>
    <!-- JavaSrcipt。简称：js。html+js+css 
    是一种弱类型的脚本语言。
    var a=0;
    -->
    <script type="text/javascript">
 /*    var a=0; */
    //调试js有2种方法：一种alert，弹出框。一种叫命令行。
   // alert(a);//打印基本数值的时候没有区别。但是
   //打印对象的时候，alert  [Object Object] .
/*   var al= new Array();
   al[0]=1;
   al[1]=2.2; */
   //打印只有基本数据类型的对象的时候，还是会显示值
   //alert(al);
    /* console.log(a);
    a=1.5;
    console.log(a); */
    </script>
    <script type="text/javascript">
    //js除了基本写法之外，还可以写方法
    function login(){
    	//获取到form。
   var form1= 	document.getElementById("loginform1");
    	var name=document.getElementById("txt_name1").value;
    		var pwd=document.getElementById("txt_pwd1").value;
    console.log(name);
    if(name=="www"&&pwd=="dd"){
    	console.log(1);
    	form1.submit();
    }else{
    	console.log(2);
    	window.open("error.jsp");
    }
    //form1.submit();
    }
    </script>
    <form id="loginform1" action="./result.jsp">
    账号：<input id="txt_name1" name="txt_name" type="text" value=""><br>
     密码：<input id="txt_pwd1"  name="txt_pwd" type="password" value=""><br>
         <!-- <input type="submit" value="登录"><br> -->
       <input type="button" value="登录" onclick="login()">
    </form>
  </body>
</html>
